<template>
	<view>
		<cmd-page-body type="bottom">
			<view>
				<cmd-cel-item title="头像" slot-right arrow @click="updateUserHeader">
					<cmd-avatar :src="userInfo.headImg"></cmd-avatar>
				</cmd-cel-item>
				<cmd-cel-item title="昵称" :addon="userInfo.userName" arrow @click="updateUserName"></cmd-cel-item>
				<cmd-cel-item title="名片" addon="二维码" arrow @click="qr"></cmd-cel-item>
			</view>
		</cmd-page-body>
	</view>
</template>

<!-- <template>
	<view>
		<web-view src="/hybrid/html/local.html" @message="getMessage"></web-view>
	</view>
</template> -->

<script>
	import cmdPageBody from '@/components/cmd-page-body/cmd-page-body.vue';
	import cmdTransition from '@/components/cmd-transition/cmd-transition.vue';
	import cmdCelItem from '@/components/cmd-cell-item/cmd-cell-item.vue';
	import cmdAvatar from '@/components/cmd-avatar/cmd-avatar.vue';

	import Global from '@/common/js/chat/config.js';
	import helper from '@/common/js/chat/helper.js';
	import SocketUser_1 from '@/common/js/chat/SocketUser.js';

	export default {
		components: {
			cmdPageBody,
			cmdTransition,
			cmdCelItem,
			cmdAvatar
		},
		data() {
			return {
				userInfo: {
					Id: 0,
					Token: '',
					headImg: '',
					userName: ''
				}
			};
		},

		onLoad: function(option) {
			var userInfo = Global.UserInfo();
			uni.setNavigationBarTitle({
				title: option.userName
			});
			this.userInfo.Id = userInfo.id;
			this.userInfo.Token = userInfo.token;
			this.userInfo.userName = Global.UserInfo().paras.userName;
			this.userInfo.headImg = Global.UserInfo().paras.headImg;
		},

		onHide: function() {
			uni.hideLoading();
		},

		methods: {

			open: function() {
				uni.navigateTo({
					url: '../webview/webview'
				});
			},

			updateUserHeader: function() {
				var that = this;
				uni.chooseImage({
					count: 1,
					sizeType: ['compressed'],
					sourceType: ['album'],
					success: function(res) {
						uni.showLoading({
							title: 'loading...'
						});

						helper.Uploader(res.tempFilePaths, function(primaryKey, paths) {
							setTimeout(function() {
								if (paths.length > 0) {
									var value = Global.Global.FileService + paths[0].Img120();

									var socketUser = new SocketUser_1.SocketUser();
									socketUser.UpdateUserParas({
											Id: that.userInfo.Id,
											Token: that.userInfo.Token,
											Paras: {
												headImg: value
											}
										},
										function(data) {

											var userInfo = Global.UserInfo();
											userInfo.paras.headImg = value;
											userInfo.paras = JSON.stringify(userInfo.paras);
											Global.UserInfo(userInfo);

											that.userInfo.headImg = value;
											uni.hideLoading();
										}
									);
								}
							}, 500);
						});
					}
				});
			},

			updateUserName: function() {
				var that = this;
				plus.nativeUI.prompt(
					'Input your name: ',
					function(e) {
						switch (e.index) {
							case 0:
								if (e.value) {


									if (that.userInfo.userName != e.value) {
										var socketUser = new SocketUser_1.SocketUser();
										uni.showLoading({
											title: 'loading...'
										});
										socketUser.UpdateUserParas({
												Id: that.userInfo.Id,
												Token: that.userInfo.Token,
												Paras: {
													userName: e.value
												}
											},
											function(data) {

												var userInfo = Global.UserInfo();
												userInfo.paras.userName = e.value;
												userInfo.paras = JSON.stringify(userInfo.paras);
												Global.UserInfo(userInfo);

												uni.hideLoading();

												that.userInfo.userName = e.value;
											}
										);
									}
								}

								break;
							default:
								break;
						}
					},
					'修改昵称',
					'your name',
					['OK', 'Cancel']
				);
			},

			qr: function() {
				var userinfo = Global.UserInfo();
				var value = JSON.stringify({
					type: 'adduser',
					data: {
						id: userinfo.id,
						info: userinfo.paras
					}
				});

				uni.navigateTo({
					url: '../test/test?value=' +value
				});
			}
		}
	};
</script>

<style></style>

